<template>
	<page  ref='page'>
		<!-- 小区自营商品分类 - type - list - page wwl -->
		<view class="page">
			<!-- <view class="top_box">
				<view class="search_box">
					<input type="text"  maxlength="20" v-model='title' confirm-typ="search" @confirm="page = 1;getList()" class="select_text2" :focus="isFocus" @focus='isFocus = true' @blur='isFocus = false'/>
					<view class="select_text1" v-if='!title && !isFocus' @click="isFocus = true">
						<image src="http://tuzhuang-1304727035.file.myqcloud.com/20211213/moIgND2cnkrxJ7nCJvljsDhjGXdLT9Pj77rnPBP9.png" mode="scaleToFill" ></image>
						<text>搜索</text>
					</view>
				</view>
			</view> -->
			<scroll-view  style='height:100%' enableBackToTop="true" scroll-y="true" @scrolltolower="loadMore">
				<view class="list_box">
					<block  v-if='total != 0'>
						<!-- <renovationShop v-for='(row,index) in list' :key='index' :row='row' status='shop' type='buildingMaterialsCity' :duihuan='duihuan' :offer='offer'/>
						<loadingText :type="loading || page * size < total" /> -->
						<renovation-row :list='list'  :type='type' :page='page' :size='size' :offer='offer' :duihuan='duihuan' />
						<loadingText :type="loading || page * size < total" />
					</block>
					<view  style='padding-top:200rpx' v-else-if="!loading">
						<empty  :status='2'/>
					</view>
				</view>
				<foot />
			</scroll-view>
		</view>
	</page>
</template>

<script>
	import  { getTabList , getShopList, getGZGoodsList} from "./static/api.js"
	import vgtTab from "@/components/vgt-tab/vgt-tab.vue"
	import  renovationShop  from "@/components/renovation-shop.vue"
	import renovationRow from "@/components/renovation-row.vue"
	export default {
		components: {
			vgtTab,renovationShop,renovationRow
		},
		data(){
			return{
				isFocus:false,
				title:'',
				loading:false,
				type:'buildingMaterialsCity',
				build_city_nav_id:0,
				classifytop:[],
				shopping_id:0,
				typeName:null,
				tabList:[],
				tabActive:0,
				list:[],
				page:1,
				size:10,
				total:0,
				cityId:'',
				offer:'',
				isType:true,
				jiacan:'',
				duihuan:3,
			}
		},
		
		onReachBottom(){
			if(this.page * this.size >= this.total || this.loading) return
			this.page ++
			this.getList()
			
			
		},
		methods: {
			async getTabInfo(){
				this.loading = true 
				uni.showLoading()
				try{
					var res = await getTabList({build_city_id:this.type})
					this.tabList = [{id: 0, name: "全部"},...res]
				}catch{
					this.loading = false
					uni.hideLoading()
				}
				await this.getList()
			},
			async getList(){
				this.loading = true;
				if(this.page == 1) uni.showLoading() 
				try{
					
					var res = await getGZGoodsList({build_city_nav_id:this.build_city_nav_id,page:this.page,limit:this.size})
					
					console.log(res,'商品信息');
					this.list = this.page == 1 ? res.list : [...this.list,...res.list]
					this.total = res.count
					this.page = res.page
					this.size = res.limit
					this.classifytop = res.classifytop
					
					// this.list =  this.page == 1 ? res.list : [...this.list,...res.list]
					// this.total = res.count
					this.loading = false
					if(this.page == 1) uni.hideLoading() 
				}catch{
					this.loading = false
					uni.hideLoading()
				}
			},
			switchTab(x){
				this.tabActive = x.currentInd
				this.page = 1
				this.total = 0
				this.size = 10
				this.list = []
				this.getList()
			},
			loadMore(){
				if( this.page * this.size >= this.total ||  this.loading) return
				this.page ++ 
				this.getList()
			},
		},
		// onShow(){
		// 	var option = this.$global.$editUploadBack(4, 'buildingMaterialClassificationsCityLike')
		// 	if(option && option.id && this.list.findIndex(x=>x.id == option.id) != -1){
		// 	var index = this.list.findIndex(x=>x.id == option.id)
		// 		if(index != -1){
		// 			this.list[index].is_like = this.list[index].like > option.like ? 2 : 1
		// 			this.list[index].like = option.like
		// 		}
		// 	}
		// },
		onLoad(params){
			// if(params.jiacan) this.jiacan = params.jiacan;
			// if(params.offer) this.offer = params.offer
			// if(params.isType) this.isType = params.isType
			this.build_city_nav_id = params.build_city_nav_id
			// this.shopping_id = params.shopping_id
			console.log(params.typeName, '角色判断');
			if(params.typeName){
				this.typeName =  decodeURIComponent(params.typeName)
				uni.setNavigationBarTitle({
				    title: this.typeName
				});
			}
			if(params.duihuan != undefined){
				this.duihuan = params.duihuan;
			}
	        this.getList()
			
		}
	}
</script>

<style lang="scss" scoped>
	page{
		width: 100%;
		min-height: 100%;
		display: flex;
		background-color:#fff;
	}
	.page {
		background-color: #fff;
	    flex: 1;
		display: flex;
	    flex-direction: column;
	    overflow: hidden;
		height: 100vh;
	  }
	  .top_box{
		  padding:  30rpx 36rpx 20rpx;
		  width: 100% ;
		  box-sizing: border-box;
		  background-color: #fff;
	  }
	  .list_box{
		  padding:  0 36rpx;
		  width: 100% ;
		  box-sizing: border-box;
		  min-height: 60vh;
	  }
	  .search_box{
	  	position: relative;
		.select_text2{
			width: 100%;
			height: 64rpx;
			background: #f6f7fb;
			border-radius: 32rpx;
			font-size: 28rpx;
			line-height: 64rpx;
			color:#333;
			text-align: center;
			// padding: 0 26rpx ;
			box-sizing: border-box;
		}
		.select_text1{
			font-size: 28rpx;
			color:#A4A4A4;
			position: absolute;
			left: 50%;
			top:50%;
			transform: translate(-50%,-50%);
			display: flex;
			justify-content: center;
			align-items: center;
			image{
				width: 40rpx;
				height: 40rpx;
			}
			
		}
	  }
	 
	  
</style>
